@extends('layouts.base')

@section('title', '数据统计')
@section('admin-style')
<link rel="stylesheet" href="{{ asset('assets\element-ui\lib\theme-chalk\index.css') }}">
<!-- import Vue before Element -->
<script src="{{ asset('assets\vue\vue.js')}}"></script>

<!-- import JavaScript -->
<script src="{{ asset('assets\element-ui\lib\index.js') }}"></script>
<script src="{{ asset('assets\axios\axios.min.js') }}"></script>
@stop
@section('content')

<!-- ============================================================== -->
<!-- Container fluid  -->
<!-- ============================================================== -->
<div class="container-fluid">
	<!-- ============================================================== -->
	<!-- Bread crumb and right sidebar toggle -->
	<!-- ============================================================== -->
	<div class="row page-titles">
	    <div class="col-md-5 align-self-center">
	        <h3 class="text-themecolor">缺货商品</h3>
	    </div>
	    <div class="col-md-7 align-self-center">
	        <ol class="breadcrumb">
	            <li class="breadcrumb-item"><a href="javascript:void(0)">首页</a></li>
	            <li class="breadcrumb-item">数据统计</li>
	            <li class="breadcrumb-item active">缺货商品</li>
	        </ol>
	    </div>
	</div>
	<!-- ============================================================== -->
	<!-- End Bread crumb and right sidebar toggle -->
	<!-- ============================================================== -->
 
	<!-- ============================================================== -->
	<!-- Start Page Content -->
	<!-- ============================================================== -->
	<div class="row">
	    <div class="col-12">
	        <div class="card">
	            <div class="card-body">
	                <h4 class="card-title">商品列表</h4>
	                <h6 class="card-subtitle"></h6>
                	<div class="card-body">
                        {{-- <form method="get" action="{{ route('admin.managers.index') }}">
                            <div class="form-row">
                                <div class="col-md-3 mb-3">
                                  <label for="validationDefault04">姓名</label>
                                  <input type="text" name="name" class="form-control" id="validationDefault04" placeholder="姓名" value="{{ $name }}" >
                                </div>
                                <div class="col-md-3 mb-3">
                                  <label for="validationDefault05">手机号</label>
                                  <input type="text" name="phone" class="form-control" id="validationDefault05" placeholder="手机号" value="{{ $phone }}" >
                                </div>
                            </div>
                            <button class="btn btn-primary" type="submit">筛选</button>
                            <a href="{{ route('admin.managers.index') }}" class="btn btn-info">重置</a>
                        </form> --}}{{-- 
                        @can('admin.notices.create') --}}
                        <a class="btn btn-success float-right" href="{{ route('admin.statistics.putGoodsExcel') }}"></i> 导出</a>
                        {{-- @endcan        --}}
                    </div>        
	                <div class="table-responsive">
	                    <table id="demo-foo-addrow" class="mail-desc table table-bordered m-t-30 table-hover contact-list" data-paging="true" data-paging-size="7">
	                        <thead>
	                            <tr>
	                                <th>商品名称</th>
	                                <th>商品图片</th>
	                                <th>总容量</th>
	                                <th>总库存</th>
	                                <th>总缺货</th>
	                            </tr>
	                        </thead>
	                        <tbody>
	                        	@foreach($freights as $value)
	                            <tr>
	                                <td>{{ optional($value->goods)->goods_name }}</td>
	                                <td><img src="{{ optional($value->goods)->goods_image }}" height="50" width="50"></td>
	                                <td>{{ $value->capacity_num }}</td>
	                                <td>{{ $value->stock_num }}</td>
	                                <td>{{ $value->capacity_num - $value->stock_num }}</td>
	                            </tr>
	                            @endforeach
	                        </tbody>
	                    </table>
	                    {{ $freights->links() }}
	                </div>
	            </div>
	        </div>
	    </div>
	</div>
	               
</div>         
                        
@stop

@section('admin-js')
	<script type="text/javascript">		

		Vue.prototype.$axios = axios;
	    Vue.prototype.$dcopy = function($arr){
	        return JSON.parse(JSON.stringify($arr));
	    }
	    new Vue({
	    	el: '#app',
            data(){
            	return {                  
                  nextActive:false,
              }
            },
            created(){

            },
            mounted(){
                
            },
            methods:{
            	
            }
	    });
		
	</script>

@stop